<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<title>全屏滚动组件fullPage演示 | jQuery特效|手机微信网站特效| 网页特效库</title>
<meta name="keywords" content="SVG特效, 手机微信网站特效, css3动画, html5特效, 网页特效" />
<meta name="description" content="网页特效库-专注于HTML5、CSS3、js、jQuery、手机移动端等网页特效的手机与分享。特效库始终坚持：无会员、无积分、无限制的“三无原则”，所有的资源都免费提供广大童鞋下载学习和使用。" />
<style>
* { margin: 0; padding: 0;}
.wrap { width: 960px; margin: 0 auto; font: 14px Tahoma,Helvetica,Arial,"宋体";}
p { margin: 14px 0; text-align: center;}
ul { margin-top: 20px; list-style-type: none; overflow: hidden; zoom: 1;}
li { position: relative; float: left; width: 300px; margin: 0 10px 20px;}
ul a { float: left; width: 300px; height: 60px; line-height: 60px; color: #333; text-align: center; text-decoration: none; background-color: #eee;}
ul .downLink { position: absolute; right: 0; bottom: 0; width: auto; height: auto; padding: 5px 10px; line-height: normal; font-size: 12px; color: #666; background-color: #ddd;}
ul .downLink:hover { color: #000;}
</style>
</head>

<body>
<h1 style="margin: 40px; font: 32px Microsoft Yahei; text-align: center;">jQuery全屏滚动插件fullPage.js演示</h1>

<div class="wrap">
	<p>fullPage 是一款不依赖任何 js 库的全屏滚动组件，支持垂直/水平滚动、CSS3 旋转/缩放动画，支持 IE5.5+，支持移动设备。</p>
	<ul>
		<li><a href="index2.html" target="_blank">垂直滚动</a></li>
		<li><a href="index3.html" target="_blank">水平滚动</a></li>
		<li><a href="index4.html" target="_blank">CSS3 动画1</a></li>
		<li><a href="index5.html" target="_blank">CSS3 动画2</a></li>
		<li><a href="index6.html" target="_blank">CSS3 动画3</a></li>
		<li><a href="index7.html" target="_blank">过度效果</a></li>
		<li><a href="index8.html" target="_blank">回调函数</a></li>
		<li><a href="index9.html" target="_blank">自动滚动</a></li>
	</ul>
</div>
<div style="width: 100%; height: auto; line-height: 25px; text-align: center;">
	更多网页特效，请访问<a href="http://www.5iweb.com.cn"><b>网页特效库</b></a>,欢迎加入网页特效库QQ交流群：258242983
</div>
<div style="width: 320px; height: 250px; position: fixed; right: 0px; top: 0px;">
	<script type="text/javascript">
	var cpro_id = "u2636040";
	</script>
	<script src="http://cpro.baidustatic.com/cpro/ui/i.js" type="text/javascript"></script>	
</div>


<style>
.menu { height: 30px; margin-bottom: 30px; padding: 10px; background-color: #f0f0f0; text-align: center;}
.menu a { display: inline-block; height: 30px; padding: 0 20px; line-height: 30px; font-size: 14px; color: #333; text-decoration: none;}
.menu a:hover { color: #000; background-color: #e9e9e9;}
.menu .cur { background-color: #ddd !important; color: #000;}
</style>


</body>
</html>